<!DOCTYPE html>
<html class="no-js" lang="zh_CN">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, maximum-scale=1">

    <title>${system_admin_title}</title>
    #required_css
</head>

<body>#loading


<div class="app $!layout">
    <!-- 头部菜单 -->
    #header
    <section class="layout">
        <!-- 菜单 -->
        #sidebar
        <section class="container">
            <!-- 机构  -->
            <aside class="sidebar-250 canvas-right">
                <header class="header navbar clearfix-default pl0 pr0">
                    <p class="navbar-text"><i class="fa fa-sitemap mr5"></i> 组织结构</p>
                </header>
                <div class="content-wrap no-p">
                    <div class="wrapper">
                        <div id="jsTreeUnit"></div>
                    </div>
                </div>
                <footer>
                    <div class="alert alert-info p10">
                        <strong>提示：</strong>&nbsp;只可以看到当前用户所在机构下属的角色
                    </div>
                    <div class="mb5">
                        包含下级&nbsp;
                        <input type="checkbox" name="includeChildren" class="switch">
                    </div>
                </footer>
            </aside>
            <!-- 内容主体 -->
            <section class="main-content">
                <!-- 主体操作栏 -->
                <header class="header navbar">
                    <!-- 左按钮区 -->
                    <div class="btn-group tool-button">
                        #ifAuthButton("btnAdd")
                        <button class="btn btn-primary navbar-btn" onclick="doAddRole()"><i class="fa fa-plus"></i> 新增角色</button>
                        #end
                        #ifAuthButton("btnRemove")
                        <button id="btnRemove" class="btn btn-danger navbar-btn" onclick="delSel()"><i class="fa fa-close"></i> 删除选中
                        </button>
                        #end
                    </div>
                    <div class="pull-right offscreen-right">
                        <button class="btn btn-primary navbar-btn"
                                onclick="ns.view.showSidebarStatic('.sidebar-panel')"><i class="fa fa-sliders"></i> 筛选
                        </button>
                    </div>
                </header>
                <div class="content-wrap">
                    <div class="wrapper">
                        <div class="row">
                            <div class="col-lg-12 col-md-12">
                                <table id="dgRole"></table>
                                <div id="dgRolePager"></div>
                            </div>
                        </div>
                    </div>
                </div>
                <a class="exit-offscreen"></a>
            </section>
        </section>
    </section>
</div>
<div class="sidebar-panel from-right">
    <div class="sidebar-panel-container shadow">
        <header class="sidebar-panel-header">
            <h4>筛选</h4>
            <a class="sidebar-panel-close text-center"><i class="ti-close"></i> </a>
        </header>
        <div class="sidebar-panel-content">
            <form id="searchForm" role="form">
                <div class="form-group">
                    <label for="name">角色名</label>
                    <input id="name" name="name" type="text" class="form-control" placeholder="按角色名模糊查询" autofocus>
                </div>
                <button type="submit" class="btn btn-primary btn-form-submit">查询</button>
                <button type="reset" class="btn btn-default">重置</button>
            </form>
        </div>
    </div>
</div>
#required_js

<script type="text/javascript">
    //导入js
    ns.requireJS([
        "/framework/js/form/checkbox.js",
        "/framework/js/form/switch.js",
        "/framework/js/view/toast.js",
        "/framework/js/view/tree.js",
        "/framework/js/view/treetable.js",
        "/framework/js/view/datagrid.js",
        "/framework/js/form/search.form.js"]);
    var dgRole;
    function initTreeView() {
        $("#jsTreeUnit").jstree({
            plugins: ["wholerow"],
            core: {
                data: {
                    url: function (node) {
                        return node.id === "#" ? "$!basePath/system/unit/tree" : "$!basePath/system/unit/tree/" + node.id
                    }
                },
                multiple: false
            }
        }).on("select_node.jstree", function (node, selected) {
            loadRole(selected.selected[0]);
        }).on("loaded.jstree", function (node, jstree) {
            var id = ns.data.sessionStorage.get("sys_role_tree_id");
            if (!id)
                id = $(node.target).find("li:first").attr("id");
            if (id)
                jstree.instance.select_node(id);
        });
    }
    function initDataGrid() {
        dgRole = $("#dgRole").jqGrid({
            url: '$!basePath/system/role/unitrole/data',
            datatype : "local",
            colModel: [
                { label: 'ID', name: 'id', key: true, hidden:true, align:"left" },
                { label: '名称', name: 'name', width:100},
                { label: '描述', name: 'descript', width:200},
                { label: "#i18n('system.common.status')", name: 'enabled', width:100, formatter:function(val){
                    return ns.view.datagrid.renderEnabled(val);
                }},
                { label:"#i18n('system.common.op')",formatter:function(val,node,data){
                    return ns.view.datagrid.renderOp([
                        {title:"查看权限", onclick:function(){
                            ns.view.showModal("$!basePath/system/role/detail/right/"+data.id,{border:false});
                        }},
                        {title:"查看下属用户", onclick:function(){
                            ns.view.showModal("$!basePath/system/role/detail/user/"+data.id,{border:false,size:"modal-lg"});
                        }},
                        {divider:true},
                        {title: "授权", onclick:function(){
                            ns.view.showModal("$!basePath/system/role/edit/right/"+data.id,{size:"modal-lg"});
                        }},
                        {title: "修改", onclick:function(){
                            ns.view.showModal("$!basePath/system/role/edit/"+data.id,{
                                onHidden : function(dialog, obj){
                                    if(dialog.isEdited){
                                        dgRole.reload();
                                    }
                                }
                            });
                        }},
                        {title:"删除", onclick:function(){
                            doDelete(data.id);
                        }},
                        {title:"复制", onclick:function(){
                            doCopy(data.id);
                        }},
                        {divider:true},
                        {title:"启用", onclick:function(){
                            enableRole(data.id);
                        }},
                        {title:"禁用", onclick:function(){
                            disableRole(data.id);
                        }}
                    ]);
                } }
            ],
            height: $(".main-content .wrapper").height() - ns.view.datagrid.offsetHeight,
            pager: "#dgRolePager",
            searchForm : "#searchForm",
            icheckbox : true,
            selectedToggle : "#btnRemove"
        });
    }
    var currentUnitId = "";
    function loadRole(id) {
        currentUnitId = id;
        dgRole.setGridParam({
            datatype : "json",
            postData : {unitId : id}
        }).trigger("reloadGrid");
    }
    function doDelete(id) {
        ns.tip.confirm("角色删除后无法恢复，并且角色下属用户将失去该角色的所有菜单权限！确定删除吗？", function () {
            $.post("$!basePath/system/role/delete/" + id, {}, function (data) {
                if (data.success == true) {
                    ns.tip.toast.success("删除成功!");
                    dgRole.reload();
                } else {
                    ns.tip.toast.error(data.message);
                }
            });
        });
    }
    function delSel() {
        var ids = dgRole.getSelectRows();
        if (ids.length == 0) return ns.tip.toast.warning("请选择要删除的角色！");
        ns.tip.confirm("确定要删除选中的角色吗？", function () {
            var bar = ns.view.showProgressbar("正在删除...");
            ns.post("$!basePath/system/role/delete", {ids: ids.toString()}, function (success, data) {
                if (success) {
                    dgRole.reload();
                } else {
                    return ns.tip.toast.error(data.message);
                }

                bar.close();
            })
        });
    }
    function enableRole(id) {
        $.post("$!basePath/system/role/enable/" + id, {}, function (data) {
            if (data.success == true) {
                dgRole.reload();
            } else {
                Toast.error(data.message);
            }
        });
    }
    function disableRole(id) {
        $.post("$!basePath/system/role/disable/" + id, {}, function (data) {
            if (data.success == true) {
                dgRole.reload();
            } else {
                Toast.error(data.message);
            }
        });
    }

    function doAddRole(){
        ns.view.showModal("$!basePath/system/role/add?uid="+currentUnitId,{
            onHidden : function(dialog, obj){
                if(dialog.isSaved){
                    ns.confirm("角色添加成功，是否立即对此角色进行授权？", function(){
                        ns.view.showModal("$!basePath/system/role/edit/right/"+dialog.id,{size:"modal-lg"});
                    });
                    dgRole.reload();
                }
            }
        })
    }

    //复制
    function doCopy(id){
        ns.view.showModal("$!basePath/system/role/copy?id="+id, {
            onHidden : function(data){
                if(data.isCopy == true){
                    dgRole.reload();
                }
            }
        });
    }
    $(function () {
        initTreeView();
        initDataGrid();

        $("input[name='includeChildren']").on("change", function(){
            dgRole.reload({includeChildren:this.checked});
        });
    });
</script>
#loading_close
</body>
</html>
